﻿
@{
    Layout = null;
}
<link rel="stylesheet" href="~/css/table.css" type="text/css">
<script src="~/jquery-easyui-1.3.5/jquery-1.11.1.js"></script>
<script src="~/Js/jquery.validate.js"></script>
<script src="~/Js/jquery.validate.unobtrusive.js"></script>
<script src="~/Js/jquery.unobtrusive-ajax.js"></script>
<script src="~/js/vue.js"></script>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>无标题文档</title>
    <link rel="stylesheet" href="../../css/table.css" type="text/css">
    <link rel="stylesheet" type="text/css" media="all"
          href="../../javascript/calendar/calendar-win2k-cold-1.css">
    <script type="text/javascript" src="../../javascript/calendar/cal.js"></script>
    <script type="text/javascript" src="../../javascript/comm/comm.js"></script>
    <script type="text/javascript" src="../../javascript/comm/list.js"></script>
    <script type="text/javascript" src="../../javascript/jquery-1.7.2.js"></script>
    <script type="text/javascript" src="../../javascript/calendar-ch.js"></script>
    <script type="text/javascript" src="../../javascript/comm/time.js"></script>
    <link rel="stylesheet" href="../../css/cwcalendar.css" type="text/css">

</head>
<div id="app">
    <form method="post" action="/HR_Fist/salaryCriterion/salaryCriterionAction!querysalarystandardByPage">
        <table width="100%">
            <tr>
                <td>
                    <font color="black">您正在做的业务是:人力资源管理--薪酬标准管理--薪酬标准登记查询</font>
                </td>
            </tr>
            <tr>
                <td>
                    &nbsp;
                </td>
            </tr>
            <tr>
                <td>
                    符合条件的薪酬标准总数: {{rows}}例
                    <input type="hidden" value="@ViewBag.s" id="id" />
                </td>
            </tr>
        </table>

        <table width="100%" border="1" cellpadding=0 cellspacing=1
               bordercolorlight=#848284 bordercolordark=#eeeeee
               class="TABLE_STYLE1">
            <tr>
                <td width="15%" class="TD_STYLE1">
                    <span>薪酬标准编号</span>
                </td>
                <td width="20%" class="TD_STYLE1">
                    <span>薪酬标准名称</span>
                </td>
                <td width="15%" class="TD_STYLE1">
                    <span>制定人</span>
                </td>
                <td width="30%" class="TD_STYLE1">
                    <span>登记时间</span>
                </td>
                <td class="TD_STYLE1" width="15%">
                    薪酬总额
                </td>
            </tr>
            <tr class="TD_STYLE2" v-for="(item,index) in dt">
                <td><a :href="'/salaryCriterion/salarystandard_check/'+[item.Id]">{{item.standard_id}}</a></td>
                <td>{{item.standard_name}}</td>
                <td>{{item.designer}}</td>
                <td>{{item.regist_time|cdate}}</td>
                <td>{{item.salary_sum}}</td>
            </tr>
        </table>
        <div align="center" style="font-size: 18px;color: gray">
            &nbsp;&nbsp;总数：
            <font style="color: maroon;font-weight: bold;">{{rows}}</font>
            例
            &nbsp;&nbsp;&nbsp;
            每页显示 <font style="color: maroon;font-weight: bold;">{{pageSize}}</font>
            条
            &nbsp;&nbsp;&nbsp;
            当前第 <font style="color: maroon;font-weight: bold;">{{currentPage}}</font>
            页
            &nbsp;&nbsp;&nbsp;共
            <font style="color: maroon;font-weight: bold;">{{pages}}</font>
            页
            <a style="color: navy;font-weight: bold" v-on:click="first()">首页</a>

            <a style="color: navy;font-weight: bold"
               v-on:click="prev()">上一页</a>

            <a style="color: navy;font-weight: bold"
               v-on:click="next()">下一页</a>

            <a style="color: navy;font-weight: bold"
               v-on:click="last()">末页</a>
            &nbsp;&nbsp;&nbsp;跳到第
            <input id=page type=text v-model="tpage" class=input1 size=1>
            页&nbsp;&nbsp;
            <input type="image" v-on:click="tiao()" src="../../images/go.bmp" width=18 height=18 border=0>

        </div>
    </form>
</div>

<script type="text/javascript">
    var vm = new Vue({
        el: "#app",
        data: {
            dt: [],
            rows: 0,
            pageSize: 2,
            currentPage: 1,
            pages: 0,
            tpage: 1
        },
        methods: {
            fill: function () {
                var t = this;
                var id = $("input[id='id']").val();
                $.ajax({
                    url: "/salaryCriterion/Index4",
                    data: "currentPage=" + t.currentPage + "&id=" + id,
                    type: "get",
                    success: function (msg) {
                        var d = eval("(" + msg + ")");
                        t.dt = d["list"];
                        t.rows = d["rows"];
                        t.pages = d["pages"];
                    }
                });
            },
            first: function () {
                this.currentPage = 1;
                this.fill();
            },
            prev: function () {
                if (this.currentPage > 1) {
                    this.currentPage = this.currentPage - 1;
                } else {
                    this.currentPage = 1;
                }
                this.fill();
            },
            next: function () {
                if (this.currentPage < this.pages) {
                    this.currentPage = this.currentPage + 1;
                } else {
                    this.currentPage = this.pages;
                }
                this.fill();
            },
            last: function () {
                this.currentPage = this.pages;
                this.fill();
            },
            tiao: function () {
                if (this.tpage <= this.pages && this.tpage > 0) {
                    this.currentPage = this.tpage;
                    this.fill();
                } else {
                    alert("页数错误！！");
                    this.tpage = 1
                }
            }
        },
        mounted: function () {
            this.fill();
        },
        filters: {
            cdate: function (s) {
                var time = new Date(s);
                var y = time.getFullYear();
                var m = time.getMonth() + 1;
                var d = time.getDate();
                return y + "年" + m + "月" + d + "日";
            }
        }
    });
</script>